<template>
  <!-- :show-message="showMessage" -->
  <el-form
    :model="ruleForm"
    :rules="rules"
    ref="ruleForm"
    size="medium"
  >
    <el-form-item prop="val">
      <el-input v-model="ruleForm.val" placeholder="输入"></el-input>
    </el-form-item>
  </el-form>
</template>


<script>
let regInfo = {
  ch: {
    regStr: "\\u4e00-\\u9fa5",
    tip: "中文"
  },
  en: {
    regStr: "a-zA-Z",
    tip: "大小写字母"
  },
  no: {
    regStr: "0-9",
    tip: "数字"
  }
};

export default {
  // type:input
  props: {
    // cellInfo: {
    //   type: Object,
    //   required: true
    // },
    value: {
      // type: [Number, String, null],
      // required: true
    },


    isRequire: {
      type: Boolean,
      required: true
    },
    // showMessage: {
    //   type: Boolean,
    //   default: true
    // }
  },
  created() {
    this.ruleForm.val = this.value;
  },
  watch: {
    // 监听上层的传入值的改动
    value(nv, ov) {
      this.ruleForm.val = nv;
    },
    "ruleForm.val"(nv, ov) {
      // 改变上层的v-mode值
      this.$emit("input", this.ruleForm.val);
      if (this.$refs.ruleForm) {
        this.$emit("getForm", this.$refs.ruleForm);
      }
    }
  },
  data() {
    return {
      ruleForm: {
        val: null
      },
      // val: null,
      rules: {
        val: [
          {
            validator: this.validate,
            trigger: "blur"
          }
        ]
      }
    };
  },
  methods: {
    validate(rule, value, callback) {
      if (!value && this.isRequire) {
        callback(new Error(`必填！`));
        return
      }
      // if (
      //   this.cellInfo.fieldTextLen &&
      //   value.length > this.cellInfo.fieldTextLen
      // ) {
      //   callback(new Error(`长度不能超过${this.cellInfo.fieldTextLen}！`));
      // }
      callback();
    }
  }
};
</script>
